!function () {
    layui.config({base: '/layui/lay/modules/'}).use(['table', 'laydate', 'dateformat','upload', 'form','status','common'], function () {
        //定义
        var $ = layui.jquery,
            table = layui.table,
            form = layui.form,
            upload = layui.upload,
            dateformat = layui.dateformat,
            laydate = layui.laydate,
            common = layui.common,//自定义模块;
            layuiSta = layui.status;//自定义状态控件

        //定义总变量
        var Product = {
            tableId: "productTable",    //表格id
            codeItem:{},            //字典类别
            itemList:[],               //类别列表
            tagList:[],              //标签列表
            imgFiles:{},            //颜色图片
            covenId:"",        //封面ID
            photoFiles :[],             //相册文件流
            delSizeList :[],            //删除的尺码id
            delImgList :[],             //删除的颜色id
            delPhotoList:[],            //删除的相册id
            condition: {                //查询条件
                name: "",
                type:"",
                startDate: "",
                endDate: ""
            }
        }

        /**
         * 初始化列表列
         * **/
        Product.initColumn = function(){
            return [[
                {field: 'productId', title: 'ID', width: 80,hide:true},
                {field: 'productName', title: '产品名称', width: 160},
                {field: 'covenPhoto', title: '封面图片', width: 260,templet: '#imgRender'},
                {field: 'tagNames' ,title :'产品标签',width:180,templet:function(row){
                    return Product.initTagNames(row.tags);
                }},
                {field: 'sort' ,title :'排序',width:120},
                {field: 'status' ,title :'显示',width:120,templet:'#statusClo'},
                {field: 'releaseTime' ,title :'发布时间',width: 165, templet: function (row) {
                        return dateformat.format(row.releaseTime, 'yyyy-MM-dd hh:mm:ss');
                    }},
                {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 280, align: 'center'}
            ]];
        }

        /***
         * 重置自定义的属性值 防止数据错乱
         */
        Product.resetAttr=function(){
            Product.delPhotoList=[];
            Product.delSizeList=[];
            Product.delImgList=[];
            Product.imgFiles ={};
            Product.photoFiles =[];
        }

        /**
         * 根据id返回名称
         * @param str
         */
        Product.initTagNames = function( str ){
            var resultTip ='';
            var result ='';
            var indexTag =0;
            var tagsJson = {};
            if(Product.tagList.length >0 ){
                $.each(Product.tagList,function(index,tag){
                    tagsJson[tag.id] =tag.name;
                });
                $.each(str.split(","),function(index,tagId){
                    var tagName = tagsJson[tagId];
                    if( tagName !=undefined ){
                        resultTip +=tagName+" ";
                        indexTag ++;
                        if( indexTag < 3){
                            result += '<span>'+tagName+"</span>";
                        }else if( indexTag ==3 ){
                            result += '<span>'+tagName;
                        }else if( indexTag ==4 ){
                            result += '......';
                        }
                    }
                })

                /*$.each(Product.tagList,function(index,tag){
                  if( str.indexOf( ','+tag.id+',' ) != -1
                      || str.indexOf( tag.id+',' ) != -1
                      || str.indexOf( ','+tag.id ) != -1){
                      resultTip +=tag.name+" ";
                      indexTag ++;
                      if( indexTag < 3){
                          result += '<span>'+tag.name+"</span>";
                      }else if( indexTag ==3 ){
                          result += '<span>'+tag.name;
                      }else if( indexTag ==4 ){
                          result += '......';
                      }
                  }
                });*/
                result += '</span>';
            }
            return '<div class="table-tags" title="'+resultTip+'">'+result+'</div>';
        }

        /**
         * 初始化获取标签列表
         */
        Product.initType = function(id){
            $.ajax({
                async: false,
                url: '/tag/findList',
                success: function (result) {
                    if (result && result.code == 200) {
                        Product.tagList = result.data;//
                        //重新渲染查询选项
                        var defaultHtml = '<option value="">请选择</option>';
                        var html =defaultHtml+'';
                        $.each(Product.tagList,function(key,obj){
                            html += '<option value="'+obj.id+'">'+obj.name+'</option>'
                        });
                        $(id).empty().append(html);
                    }else
                        layer.alert(result.msg || '请求失败了！', {icon: 5, title: '提示'});
                },
                error: function () {
                    layer.alert('服务器出错啦！', {icon: 2, title: '错误'});
                }
            });
            form.render('select');//需要渲染一下
        }

        /**
         * 删除尺码
         * **/
        Product.delSizeItem = function(){
            var sizeId = $(this).parent().find('input:hidden').val();
            //查找当只有三个元素的时候不允许删除
            if($('#productSize .size-item').length == 1){
                layer.msg("最少包含一个尺码");
                return false;
            }

            //删除
            if( sizeId != null && sizeId != '')
                Product.delSizeList.push(sizeId);
           $(this).parent().remove();
        }

        /**
         * 新增颜色记录
         */
        Product.addImgTr = function(){
                var addTr = $("#imgTable tbody tr:first").clone();//构建页面
                var trLenght = $("#imgTable tbody tr").length;//获取当前行数
                addTr.find('.upload-img-item').text('上传图片');
                var newUploadName = 'uploadImg'+(trLenght+1);//新增的trID
                addTr.find('.upload-img-item')[0].id = newUploadName;
                //删除新增操作
                addTr.find('.del-img-item').css("display","block");
                //删除操作显示
                addTr.find('.add-img-item').remove();
                //清空数据操作
                addTr.find('input:text').val('');
                addTr.find('input:hidden').val('');
                $(this).parents('tbody').append(addTr);
                $('.del-img-item').off('click');//解除事件
                $('.del-img-item').on('click',Product.delColorTr);//重新绑定
                //渲染上传
                Product.renderUpload( newUploadName );
        }

        /**
         * 删除颜色记录
         * **/
        Product.delColorTr = function( ){

            if($('#imgTable tbody tr').length >1){
                //删除时判断当前记录是否已经存在  如果是则需要删除
                var delId = $(this).parents('tr').find('input:hidden').val();
                if( delId !='')
                    Product.delImgList.push(delId);
                $(this).parents('tr').remove();
            }else{
                layer.msg('颜色信息必须拥有一条');
                return false;
            }
        }

        /**
         * 删除相册
         * **/
        Product.delPhotoItem = function( ){
            var photoId = $(this).parent().find('input:hidden').val();
            //删除
            if( photoId != null && photoId != '')
                Product.delPhotoList.push(photoId);
            //删除缓存里的图片
            var fileKey = $(this).parent().find('img')[0].getAttribute("fileKey");
            if( fileKey != undefined && fileKey !=''){
                var index ;
                for(var i in Product.photoFiles){
                    if( Product.photoFiles[i]["fileKey"]== fileKey){
                        index = i;
                        break;
                    }
                }
                if( index !=undefined && index != null )
                    Product.photoFiles.splice(index,1);
            }
            var photoText = $(this).parent().find('.layui-upload-top').text();
            $(this).parent().remove();
            if(photoText=="产品主图"){
                //重新设置产品主图
                var firstItem = $('#photoImgList .layui-upload-img:first');
                var firstId = firstItem.find('input:hidden').val();//获取id
                if(  firstId != null){
                    //设置封面的ID
                    Product.covenId =firstId;
                    for(var i in Product.photoFiles){
                        Product.photoFiles[i]["fileStatus"] = 0;
                    }
                    $(firstItem).find(".layui-upload-top").text("产品主图");
                }
            }

        }

        /**
         * 设置封面图片(没有产品主图时)
         */
        Product.setInitCoverPhoto= function(){
            var flagFirst = false;//是否有产品主图
            $("#photoImgList .layui-upload-top").each(function(index,uploadTop){
                if($(this).text()=='产品主图')
                    flagFirst =true;
            });
            if( !flagFirst ){//不存在产品主图时
                var $itemDiv = $("#photoImgList .layui-upload-img:first");//获取第一张图
                var photoId = $itemDiv.find('input:hidden').val();
                if(  photoId != null){
                    //设置封面的ID
                    Product.covenId =photoId;
                    for(var i in Product.photoFiles){
                        Product.photoFiles[i]["fileStatus"] = 0;
                    }
                }else{
                    Product.covenId = null;
                    var fileKey = $itemDiv.find('img')[0].getAttribute("fileKey");//获取fileKey
                    if( fileKey != undefined && fileKey !=''){
                        for(var i in Product.photoFiles){
                            if( Product.photoFiles[i]["fileKey"]== fileKey){
                                Product.photoFiles[i]["fileStatus"] = 1;
                            }else{
                                Product.photoFiles[i]["fileStatus"] = 0;
                            }
                        }
                    }
                }
                //设置显示
                $($itemDiv).find(".layui-upload-top").text("产品主图");
            }
        }

        /**
         * 设置封面图片
         */
        Product.setCoverPhoto= function(){
            var $itemDiv = $(this).parent();//获取当前图片元素
            var photoId = $itemDiv.find('input:hidden').val();
            if(  photoId != null){
                //设置封面的ID
                Product.covenId =photoId;
                for(var i in Product.photoFiles){
                  Product.photoFiles[i]["fileStatus"] = 0;
                }
            }else{
                Product.covenId = null;
                var fileKey = $(this).parent().find('img')[0].getAttribute("fileKey");//获取fileKey
                if( fileKey != undefined && fileKey !=''){
                    for(var i in Product.photoFiles){
                        if( Product.photoFiles[i]["fileKey"]== fileKey){
                            Product.photoFiles[i]["fileStatus"] = 1;
                        }else{
                            Product.photoFiles[i]["fileStatus"] = 0;
                        }
                    }
                }
            }

            //设置显示
            $("#photoImgList .layui-upload-top").text("设为主图");
            $(this).text("产品主图");

            /*console.log( Product.covenId);
            console.log( Product.photoFiles);*/
        }

        /**
         * 初始化新增页面产品标签列表 带标签类型
         * **/
        Product.initTagList = function( tagIds ){
            var dict = common.getDictListByCode("type");//获取所有的标签类型
            if( dict && dict.itemList ){
                Product.itemList = dict.itemList;
                var htmlTag ='',productTags='';//构建产品标签div
                $.each(dict.itemList,function(index,itemDict){
                    var itemCode = itemDict.itemId;
                    htmlTag +='<div class="layui-tag-title" itemId="'+itemCode+'">'+itemDict.nameItem+'</div>';
                    productTags +='<div class="layui-tag-title" itemId="'+itemCode+'">'+itemDict.nameItem+'</div>';
                    if( Product.tagList ){
                        $.each(Product.tagList,function(index,tag){
                            if( itemDict.itemId == tag.type ){
                                if( tagIds != null){//修改页面
                                    if( $.inArray( tag.id,tagIds ) > -1){
                                        htmlTag +='<div class="layui-tag-item" itemId="'+itemCode+'" title="'+tag.name+'"><input type="checkbox" lay-skin="primary" title="'+tag.name+'" value="'+tag.id+'"></div>';
                                        productTags +='<div class="layui-tag-item" itemId="'+itemCode+'" title="'+tag.name+'"><input type="checkbox" lay-skin="primary" title="'+tag.name+'" value="'+tag.id+'" checked disabled></div>';
                                    }else{
                                        htmlTag +='<div class="layui-tag-item" itemId="'+itemCode+'" title="'+tag.name+'"><input type="checkbox" lay-skin="primary" title="'+tag.name+'" value="'+tag.id+'"></div>';
                                        productTags +='<div class="layui-tag-item" itemId="'+itemCode+'" title="'+tag.name+'"><input type="checkbox" lay-skin="primary" title="'+tag.name+'" value="'+tag.id+'" disabled></div>';
                                    }
                                }else{
                                    htmlTag +='<div class="layui-tag-item" itemId="'+itemCode+'" title="'+tag.name+'"><input type="checkbox" lay-skin="primary" title="'+tag.name+'" value="'+tag.id+'"></div>';
                                    productTags +='<div class="layui-tag-item" itemId="'+itemCode+'"></div>';
                                }
                            }
                        })
                    }
                });
                //初始化系统标签列表
                $('#initTags').empty().append(htmlTag);
                //初始化产品标签列表
                $('#productTags').empty().append(productTags);

                //回写渲染结果量
                $('#productTags .layui-tag-title').each(function(){
                    var itemId = $(this).attr('itemId');
                    var itemText = $(this).text();
                    var selItem = $('#productTags .layui-tag-item[itemId='+itemId+'] input:checkbox:checked').length;
                    $(this).text(itemText+'('+selItem+')');
                });
            }
        }

        /***
         * 根据id渲染上传
         * @param uploadName
         */
        Product.renderUpload = function( uploadName ){
            upload.render({
                elem: '#'+uploadName
                ,url: '/upload/',
                auto: false
                ,choose: function(obj){
                    //修改名称
                    var $this = this.item.text('重新上传');
                    //预读本地文件示例，不支持ie8
                    obj.preview(function(index, file, result){
                        //保存imgFile文件
                        Product.imgFiles[$this[0].id]= result;
                    });

                }
            });
        }
        /**
         * 查询方法
         * **/
        Product.search = function(){
            var queryData = {};
            queryData["name"] = $("#name").val();
            queryData["type"] = $("#typeQuery").val();
            queryData["startDate"] = $("#startDate").val();
            queryData["endDate"] = $("#endDate").val();
            table.reload(Product.tableId, {where: queryData,page: {curr: 1}});
        }

        /**
         * 初始化产品信息列表
         */
        Product.initInfo = function(){
            //初始化表单
            $('#editForm')[0].reset();
            $('#editForm :input').val("");//重置所有的input
            $("#imgDiv").attr("src",'../../images/upload.png');//重置上传图片
            layuiSta.initStaProduct("#statusDiv",1);//构建状态
            Product.resetAttr();

            var dateNow = new Date();
            laydate.render({
                elem: '#releaseTime',
                type: 'datetime',
                min: 'dateNow',
                value: dateNow
            });

            //重置尺码默认三个
            var $productSize = $('#sizeItemDiv');
            var htmlDiv = $productSize.find('.size-item:first').html();
            var htmlItem ='';
            for(var i=0;i<3;i++){
                htmlItem += '<div class="size-item">';
                htmlItem += htmlDiv;
                htmlItem += '</div>';
            }
            $productSize.find('.size-item').remove();
            $productSize.find('.add-size-item').before(htmlItem);
            $('.del-size-item').off('click');//解除事件
            $('.del-size-item').on('click',Product.delSizeItem);//重新绑定
            //重置颜色 默认两个
            var $imgTable = $('#imgTable');
            var $imgTr = $imgTable.find('tbody tr:first').html();//获取第一条的html源码
            var trHtml = '';
            for(var i=0;i<2;i++){
                trHtml +='<tr>';
                trHtml +=$imgTr;
                trHtml +='</tr>';
            }
            $imgTable.find('tbody tr').remove();
            $imgTable.find('tbody').append(trHtml);
            //渲染表格内的多个上传控件
            if( $('#imgTable tbody tr').length>0  ){
                $('#imgTable tbody tr').each(function(index){
                    if( index !=0 ){
                        $(this).find('.del-img-item').css("display","block");
                        $(this).find('.add-img-item').css("display","none");
                    }else{
                        $(this).find('.del-img-item').css("display","none");
                        $(this).find('.add-img-item').css("display","block");
                    }
                    //获取上传的控件id
                    $(this).find('.upload-img-item')[0].id ='uploadImg'+index;
                    //获取上传的控件id
                    $('#'+$(this).find('.upload-img-item')[0].id+'').text('上传图片');
                    var uploadName = $(this).find('.upload-img-item')[0].id;
                    Product.renderUpload(uploadName);

                });
                //绑定新增事件
                $('.add-img-item').off('click');
                $('.add-img-item').on('click',Product.addImgTr);
                //绑定删除事件
                $('.del-img-item').off('click');
                $('.del-img-item').on('click',Product.delColorTr);
            }

            $("#photoImgList").empty();//清空相册div
            Product.initTagList();//初始化标签列表
            layui.form.render();
        }

        /***
         * 修改列表初始化渲染页面
         */
        Product.initUpdateRecord=function(data){

            Product.initInfo();//初始化重置表单
            form.render('radio').val('editForm', data);
            layuiSta.initStaProduct("#statusDiv",data.status);//构建状态
            //时间必须大于当前的时间
            var dateNow = new Date();
            var releaseTime = new Date(data.releaseTime);
            if( dateNow < releaseTime ){
                laydate.render({
                    elem: '#releaseTime',
                    type: 'datetime',
                    value:releaseTime,
                    min: 'dateNow'
                });
            }else{
                laydate.render({
                    elem: '#releaseTime',
                    type: 'datetime',
                    value:dateNow,
                    min: 'dateNow'
                });
            }


            //重新渲染规格数据 --默认三个尺码
            if( data.sizeList.length > 0){
                //获取尺码div
                var sizeItems = $(".size-item");
                /*if( data.sizeList.length < 3){
                    var defaultLen = 3;//默认显示两条
                    if( data.sizeList.length > defaultLen)
                        defaultLen =data.sizeList.length;
                    $.each(sizeItems,function(index,trDiv){
                        if( index >=defaultLen )
                            sizeItems[index].remove();
                    });
                }*/

                $.each(data.sizeList,function(index,obj ){
                   if(sizeItems[index]){
                        //赋值控件
                       $(sizeItems[index]).find('input[type=hidden]').val(obj.id);
                       $(sizeItems[index]).find('input[type=text]').val(obj.name);
                   }else{
                       //新增一行记录
                       var addSizeItem = $(".size-item:first").clone();//构建页面
                       $(addSizeItem).find('input[type=hidden]').val(obj.id);
                       $(addSizeItem).find('input[type=text]').val(obj.name);
                       //
                       $("#productSize .add-size-item").before(addSizeItem);
                   }
                });
            }
            $('.del-size-item').off('click');//解除事件
            $('.del-size-item').on('click',Product.delSizeItem);//重新绑定
            //删除空的尺码
            $(".size-item").each(function(index){
               if($(this).find('input[type=hidden]').val()=='' ){
                   $(this).remove();
               }
            });
            //重新渲染颜色数据
            if( data.imgList.length > 0){
                //获取尺码div
                var imgTr = $("#imgTable tbody tr");

                $.each(data.imgList,function(index,obj ){
                    var imgText = '重新上传';
                    if( obj.imgUrl ==null ){
                        imgText = '上传图片';
                    }
                    if(imgTr[index]){
                        //赋值控件
                        $(imgTr[index]).find('input[type=hidden]').val(obj.id);
                        $(imgTr[index]).find('input[type=text]').val(obj.imgName);
                        $(imgTr[index]).find('.upload-img-item').text(imgText);
                    }else{
                        //新增一行记录
                        var addTr = $("#imgTable tbody tr:first").clone();//构建页面
                        var trLenght = $("#imgTable tbody tr").length;//获取当前行数
                        $(addTr).find('input[type=hidden]').val(obj.id);
                        $(addTr).find('input[type=text]').val(obj.imgName);
                        $(addTr).find('.del-img-item').css("display","block");
                        $(addTr).find('.add-img-item').css("display","none");
                        addTr.find('.upload-img-item').text(imgText);
                        var newUploadName = 'uploadImg'+(trLenght+1);//新增的trID
                        addTr.find('.upload-img-item')[0].id = newUploadName;

                        $("#imgTable tbody").append(addTr);
                        Product.renderUpload(newUploadName);
                    }
                });
            }
            $('.del-img-item').off('click');//解除事件
            $('.del-img-item').on('click',Product.delColorTr);//重新绑定
            //删除空的尺码
            $("#imgTable tbody tr").each(function(index){
                if($(this).find('input[type=hidden]').val()=='' ){
                    $(this).remove();
                }
            });
            //渲染表格内的多个上传控件
            /*if( $('#imgTable tbody tr').length>0  ){
                $('#imgTable tbody tr').each(function(){
                    //获取上传的控件id
                    var uploadName = $(this).find('.upload-img-item')[0].id;
                    Product.renderUpload(uploadName);
                });
            }*/
            //重新渲染相册数据
            $("#photoImgList").empty();//清空相册div
            if( data.photoList.length > 0){
                //获取渲染相册div
                var $photoImgList = $('#photoImgList');
                $photoImgList.empty();
                $.each(data.photoList,function(index,photo){
                    //保存imgFile文件
                    var htmlPhoto = '<div class="layui-upload-img " ><input type="hidden" value="'+photo.id+'" />';
                    htmlPhoto +='<img name="photoImg" src="'+ photo.productImg +'" class="layui-upload-img" >';
                    htmlPhoto +='<div class="layui-upload-del-icon"><i class="layui-icon layui-icon-close "></i></div>';
                    //设置产品主图
                    if( data.covenId == photo.id ){
                        htmlPhoto +='<div class="layui-upload-top">产品主图</div>';
                    }else{
                        htmlPhoto +='<div class="layui-upload-top">设为主图</div>';
                    }
                    /*if($('#photoImgList .layui-upload-img').length >0 ){
                        htmlPhoto +='<div class="layui-upload-top">设为主图</div>';
                    }else{
                        htmlPhoto +='<div class="layui-upload-top">产品主图</div>';
                    }*/
                    $photoImgList.append(htmlPhoto);
                });
            }
            //绑定删除事件
            $('.layui-upload-del-icon').off('click');
            $('.layui-upload-del-icon').on('click',Product.delPhotoItem);
            //绑定设置封面事件
            $('.layui-upload-top').off('click');
            $('.layui-upload-top').on('click',Product.setCoverPhoto);

            //重新渲染tags标签
            Product.initTagList(data.tagIds);//初始化标签列表
            //重新设置产品简介值保持存储时包含空格的方式
            var text =data.productMessage;	//获取数据库查出的字符串
            var des = (text.replace(/&nbsp;/g, " ")).replace(/<br\/>/g, "\r")	//将html类型转换成对应的空格和回车
            $('#editForm textarea[name=productMessage]').val(des);

            layui.form.render();
        }

        /**
         * 新增记录
         * **/
        Product.addRecord =function (){

            Product.initInfo();//初始化

            //打开弹出层
            layer.open({
                type: 1, maxmin: true, title: '新增产品', shade: 0.4, shadeClose: false,
                area: ['920px', '600px'], content: $('#editForm').show(), btn: ['保存', '取消'],
                yes: function () {
                    $('#saveRecord').click();
                }, btn2: function () {
                    layer.closeAll();
                }, end: function () {
                    $('#editForm').hide();
                }
            });
        }

        /**
         * 修改记录
         * **/
        Product.editRecord =function (data){

            Product.resetAttr();

            //初始化数据
            $.ajax({
                async: false,
                url: '/product/findProduct?productId=' + data.productId,
                success: function (result) {
                    if (result && result.code == 200) {
                        var data = result.data;
                        //渲染界面
                        Product.initUpdateRecord(data);
                        //打开弹出层
                        layer.open({
                            type: 1, maxmin: true, title: '修改产品', shade: 0.4, shadeClose: false,
                            area: ['920px', '600px'], content: $('#editForm').show(), btn: ['保存', '取消'],
                            yes: function () {
                                $('#saveRecord').click();
                            }, btn2: function () {
                                layer.closeAll();
                            }, end: function () {
                                $('#editForm').hide();
                            }
                        });
                    }else
                        layer.alert(result.msg || '请求失败了！', {icon: 5, title: '提示'});
                },
                error: function () {
                    layer.alert('服务器出错啦！', {icon: 2, title: '错误'});
                }
            });
        }

        /**
         * 删除记录
         * **/
        Product.deleteRecord =function (data){
            $.ajax({
                async: false,
                type: 'post',
                url: '/product/delete?productId=' + data.productId,
                success: function (result) {
                    if (result && result.code == 200) {
                        layer.alert('操作成功！', {icon: 1, title: '提示'});
                        Product.search();
                    }
                },
                error: function () {
                    layer.alert('服务器出错啦！', {icon: 2, title: '错误'});
                }
            });
        }

        Product.initType('#typeQuery');

        //初始化渲染列表
        //日期
        var startDate = laydate.render({
            elem: '#startDate',
            done: function(value, date){
                endDate.config.min = date;
                endDate.config.min.month = date.month -1;
            }
        });
        var endDate =  laydate.render({
            elem: '#endDate',
            done: function(value, date){
                if($.trim(value) == ''){
                    var curDate = new Date();
                    date = {'date': curDate.getDate(), 'month': curDate.getMonth()+1, 'year': curDate.getFullYear()};
                }
                startDate.config.max = date;
                startDate.config.max.month = date.month -1;
            }
        });

        //相册图片上传
        upload.render({
            elem: '#photoUploadBtn'
            ,url: '/upload/'
            ,multiple: true
            ,accept: 'file' //普通文件
            ,exts: 'jpg|png|jpeg' //只允许上传压缩文件
            ,auto: false
            ,choose: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){

                    //判断当前数据
                    var $itemImg = $("img.layui-upload-img");
                    if($itemImg.length==5){
                        layer.msg("产品图片最多上传五张");
                        return false;
                    }

                    if( (file.size/1014).toFixed(1) > 10240 ){
                        return layer.msg("图片不能超过10M");
                        return false;
                    }
                    //限制图片尺寸
                    var img = new Image();
                    var flagUpload = true;
                    img.onload = function(){
                        if(img.width != 870 || img.height != 700){
                            layer.msg("产品相册图片固定尺寸为870*700");
                            flagUpload= false;
                        }
                        if( flagUpload ){

                            var photoSize =1,fileKey;
                            photoSize++;
                            fileKey =index+photoSize;
                            //保存imgFile文件
                            var htmlPhoto = '<div class="layui-upload-img ">';
                            htmlPhoto +='<img name="photoImg" src="'+ result +'" fileKey ="'+fileKey+'" alt="'+ file.name +'" class="layui-upload-img">';
                            htmlPhoto +='<div class="layui-upload-del-icon"><i class="layui-icon layui-icon-close "></i></div>';
                            //设置产品主图
                            /*if($('#photoImgList .layui-upload-img').length >0 ){
                                htmlPhoto +='<div class="layui-upload-top">设为主图</div>';
                            }else{
                                htmlPhoto +='<div class="layui-upload-top">产品主图</div>';
                            }*/
                            htmlPhoto +='<div class="layui-upload-top">设为主图</div>';
                            htmlPhoto +='</div>';
                            $('#photoImgList').append(htmlPhoto);
                            //存储照片信息

                            //绑定删除事件
                            $('.layui-upload-del-icon').off('click');
                            $('.layui-upload-del-icon').on('click',Product.delPhotoItem);
                            //绑定设置封面事件
                            $('.layui-upload-top').off('click');
                            $('.layui-upload-top').on('click',Product.setCoverPhoto);

                            var productPhoto = {};
                            productPhoto["fileKey"] = fileKey;
                            productPhoto["fileData"] = result;
                            productPhoto["fileStatus"] = 0;//默认是0
                            Product.photoFiles.push(productPhoto);
                            //调用方法设置产品主图
                            Product.setInitCoverPhoto();
                        }
                    };
                    img.src = result;
                });

            }
        });

        table.render({
            elem:"#productTable"
            ,url:"/product/listPage"
            ,cellMinWidth:80
            ,request: {pageName: 'pageNum', limitName: 'pageSize'}
            ,page: true
            ,cols:Product.initColumn(),
            cellMinHeight:200

        });

        // 搜索按钮点击事件
        $('#btnSearch').click(function () {
            Product.search();
        });

        // 重置点击事件
        $('#resetSearch').click(function () {
            $('#queryTools input').val('');
            $('#queryTools select').val('');
            Product.search();
        });

        // 添加按钮点击事件
        $('#btnAdd').click(function () {
            Product.addRecord();
        });


        //自定义验证规则
        form.verify({
            productName : [
                /^[\d\D]{1,128}$/
                ,'产品名称输入范围在1到128位'
            ],
            productMessage:[
                /^[\d\D]{1,300}$/
                ,'最多输入300个字符'
            ],
            nameLen : [
                /^[\d\D]{1,16}$/
                ,'输入范围在1到16位'
            ],
            proLink :[
                /^[\d\D]{0,512}$/
                ,'最多输入512个字符'
            ],
            proUrl :[
                /(http|https):\/\/([\w.]+\/?)\S*/
                ,'必须以http,https开头,且需符合URL规范,检查格式是否正确'
            ]
        });


        //监听工具条
        table.on('tool(' + Product.tableId + ')',function(obj){
            var data = obj.data;
            var layEvent = obj.event;
            if( layEvent ==='detail'){
                //查看
                return false;
            } else if( layEvent ==='del'){
                layer.confirm('确定要删除该产品信息吗？', function (index) {
                    Product.deleteRecord(data);
                    return false;
                });
            } else if( layEvent ==='edit'){
                Product.editRecord(data);
                return false;
            }
        });

        //绑定新增尺码事件
        $('.add-size-item').on('click',function(data){
            var addSizeItem = $(".size-item:first").clone();//构建页面
            //清空值
            $(addSizeItem).find('input:hidden').val('');
            $(addSizeItem).find('input:text').val('');
            $(this).before(addSizeItem);
            $('.del-size-item').off('click');//解除事件
            $('.del-size-item').on('click',Product.delSizeItem);//重新绑定
        });
        $('.del-size-item').on('click',Product.delSizeItem);//绑定事件

        //绑定新增颜色事件
        $('.add-img-item').on('click',function(data){
            var addTr = $("#imgTable tbody tr:first").clone();//构建页面
            var trLenght = $("#imgTable tbody tr").length;//获取当前行数
            addTr.find('.upload-img-item').text('上传图片');
            var newUploadName = 'uploadImg'+(trLenght+1);//新增的trID
            addTr.find('.upload-img-item')[0].id = newUploadName;
            //删除新增操作
            addTr.find('.del-img-item').css("display","block");
            //删除操作显示
            addTr.find('.add-img-item').remove();
            //清空数据操作
            addTr.find('input:text').val('');
            addTr.find('input:hidden').val('');
            $(this).parents('tbody').append(addTr);
            $('.del-img-item').off('click');//解除事件
            $('.del-img-item').on('click',Product.delColorTr);//重新绑定
            //渲染上传
            Product.renderUpload( newUploadName );
        });
        $('.del-img-item').on('click',Product.delColorTr);//绑定事件


        // 全选按钮点击事件
        $('#selTagAll').click(function () {
            if($(this).text()=="全选"){
                $('#initTags .layui-form-checkbox').addClass('layui-form-checked');
                $('#initTags input:checkbox').attr('checked',true);
                $(this).text("反选");
            }else{
                $('#initTags .layui-form-checkbox').removeClass('layui-form-checked');
                $('#initTags input:checkbox').attr('checked',false);
                $(this).text("全选");
            }
        });

        // 添加按钮点击事件
        $('#saveTags').click(function () {
            //获取所有选中的tag
            var tags =[];
            $('#initTags input:checkbox:checked').each(function(index, item){
                tags.push($(this).val())
            });

            if( tags.length == 0 ){
                layer.msg("最少选择一种标签类型");
                return false;
            }
            var productTags='';//构建产品标签div
            $.each(Product.itemList,function(index,itemDict){
                var itemId = itemDict.itemId;
                productTags +='<div class="layui-tag-title" itemId = '+itemId+'>'+itemDict.nameItem+'</div>';
                if( Product.tagList ){
                    $.each(Product.tagList,function(index,tag){
                        if( itemDict.itemId == tag.type ){
                            if( $.inArray( tag.id.toString(),tags ) > -1 ){
                                productTags +='<div class="layui-tag-item" itemId = '+itemId+'><input type="checkbox" lay-skin="primary" title="'+tag.name+'" value="'+tag.id+'" checked disabled></div>';
                            }else{
                                productTags +='<div class="layui-tag-item" itemId = '+itemId+'><input type="checkbox" lay-skin="primary" title="'+tag.name+'" value="'+tag.id+'" disabled></div>';
                            }
                        }
                    })
                }
            });
            //初始化系统标签列表
            $('#productTags').empty().append(productTags);
            //回写渲染结果量
            $('#productTags .layui-tag-title').each(function(){
                var itemId = $(this).attr('itemId');
                var itemText = $(this).text();
                var selItem = $('#productTags .layui-tag-item[itemId='+itemId+'] input:checkbox:checked').length;
                $(this).text(itemText+'('+selItem+')');
            });
            layui.form.render();
        });

        //监听提交事件
        form.on('submit(editRecord)',function(data){

            var postUrl = !data.field['productId'] ? '/product/addProduct' : '/product/editProduct';
            //1.封装规格尺寸信息
            var proSizeList =[];
            $('#productSize .size-item').each(function(){
                var $sizeItem = $(this);
                var $proName = $sizeItem.find('input:text').val();
                var $proId = $sizeItem.find('input:hidden').val();
                if( $proName !=null &&  $proName !=''){
                    var proSize ={};
                    proSize['name'] =$proName;
                    proSize['id'] =$proId;
                    proSizeList.push(proSize);
                }
            });
            if( proSizeList.length ==0 ){
                layer.msg("尺寸必须填写");
                return false;
            }

            data.field["sizeList"] =proSizeList;
            //2.封装规格颜色信息
            var proImgList =[];
            if( $('#imgTable tbody tr').length>0  ){
                $('#imgTable tbody tr').each(function(){
                    var proImg = {};
                    var $tr = $(this);
                    var imgId = $tr.find(':hidden').val();
                    var imgName = $tr.find(':text').val();
                    var imgFileId = $tr.find('.upload-img-item')[0].id;
                    if( imgName != null && imgName !=''){
                        proImg['id'] = imgId;
                        proImg['imgName'] = imgName;
                        proImg['imgFile'] = Product.imgFiles[imgFileId];
                        proImgList.push(proImg);
                    }
                });
            }
            if( proImgList.length ==0 ){
                layer.msg("颜色必须填写");
                return false;
            }
            data.field["imgList"] =proImgList;
            //只需要判断控件内有没有照片
            if( $('#photoImgList .layui-upload-img').length ==0 ){
                layer.msg("产品相册必须填写");
                return false;
            }
            data.field["photoFiles"] =Product.photoFiles;//相册信息
            data.field["covenId"] =Product.covenId;//封面图片ID
            //获取所有选中的tag
            var tagIds =[];
            $('#productTags .layui-tag-item input:checkbox:checked').each(function(index, item){
                tagIds.push($(this).val())
            });
            if( tagIds.length ==0 ){
                layer.msg("产品标签必须填写");
                return false;
            }
            data.field["tagIds"] = tagIds;

            //获取当前修改需要删除的尺码，颜色，相册
            if( Product.delSizeList.length >0 )
            data.field["delSizeList"] =Product.delSizeList;
            if( Product.delImgList.length >0 )
            data.field["delImgList"] =Product.delImgList;
            if( Product.delPhotoList.length >0 )
            data.field["delPhotoList"] =Product.delPhotoList;

            //处理产品简介保留空格换行
            var productMessageText =$('#editForm textarea[name=productMessage]').val();	//获取textarea输入的值
            var productMessageStr = productMessageText.replace(/\r\n/g, '<br/>').replace(/\n/g, '<br/>').replace(/\s/g, ' '); //把里面的回车和空格转换成html类型
            data.field["productMessage"] =productMessageStr;
            //处理购买链接
            var proLink = data.field["link"];
            if( proLink.length !=0 ){
                var regText = /(http|https):\/\/([\w.]+\/?)\S*/;
                if( !regText.test( proLink )){
                    layer.msg("必须以http,https开头,且需符合URL规范,检查格式是否正确");
                    return false;
                }
            }
            //通过json传递参数
            $.ajax({
                async: false, type: 'post',
                traditional: true,
                contentType:"application/json;charset=UTF-8",
                data: JSON.stringify(data.field),
                url: postUrl,
                processData:false,
                success: function (data) {
                    if (data && data.code == 200) {
                        layer.closeAll();
                        layer.alert('操作成功！', {icon: 1, title: '提示'});
                        Product.search();
                    } else
                        layer.alert(data.msg || '操作失败了！', {icon: 5, title: '提示'});
                },
                error: function () {
                    layer.closeAll();
                    layer.alert('服务器出错啦！', {icon: 2, title: '错误'});
                }
            });
            return false;
        });

    });
}();